/* Simple Purple Glass Cookies Dialog Styling */

/* Main dialog container */
#cboxContent.cookiesDialog {
    background: rgba(0, 0, 0, 0.6) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}

/* Main form with purple glass effect */
.cookiesSetting__form {
    background: rgba(88, 28, 135, 0.4) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(147, 51, 234, 0.6) !important;
    border-radius: 16px !important;
    box-shadow: 
        0 0 20px rgba(147, 51, 234, 0.3),
        0 8px 32px rgba(0, 0, 0, 0.2) !important;
}

/* Title styling */
.cookiesSetting__title {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
}

/* Description text */
.cookiesSetting__perex {
    color: rgba(255, 255, 255, 0.9) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

/* Cookie settings data container - fix white background */
.cookiesSetting__data {
    background: rgba(147, 51, 234, 0.1) !important;
    border-radius: 12px !important;
    padding: 16px !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

/* Cookie settings items - fix white background issue */
.cookiesSetting__item {
    background: rgba(147, 51, 234, 0.2) !important;
    border: 1px solid rgba(147, 51, 234, 0.3) !important;
    border-radius: 12px !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    margin-bottom: 12px !important;
    padding: 20px !important;
    transition: all 0.2s ease !important;
}

.cookiesSetting__item:hover {
    background: rgba(147, 51, 234, 0.3) !important;
    border-color: rgba(147, 51, 234, 0.5) !important;
    box-shadow: 0 0 12px rgba(147, 51, 234, 0.2) !important;
    transform: translateY(-2px) !important;
}

/* Item text styling - ensure readability */
.cookiesSetting__item__name,
.cookiesSetting__item__name strong {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

.cookiesSetting__item__text {
    color: rgba(255, 255, 255, 0.85) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

/* Button styling */
.cookiesSetting__button {
    background: linear-gradient(135deg, rgba(147, 51, 234, 0.7), rgba(88, 28, 135, 0.7)) !important;
    border: 1px solid rgba(147, 51, 234, 0.8) !important;
    border-radius: 8px !important;
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
    box-shadow: 0 0 8px rgba(147, 51, 234, 0.3) !important;
    transition: all 0.2s ease !important;
}

.cookiesSetting__button:hover {
    background: linear-gradient(135deg, rgba(147, 51, 234, 0.9), rgba(88, 28, 135, 0.9)) !important;
    box-shadow: 0 0 12px rgba(147, 51, 234, 0.5) !important;
    transform: translateY(-1px) !important;
}

/* Green button for "Accept All" - higher specificity */
.cookiesDialog .cookiesSetting__button--green,
#cboxContent .cookiesSetting__button--green {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.7), rgba(21, 128, 61, 0.7)) !important;
    border-color: rgba(34, 197, 94, 0.8) !important;
    box-shadow: 0 0 8px rgba(34, 197, 94, 0.3) !important;
    padding: 14px 24px !important;
    min-height: 48px !important;
    height: 48px !important;
}

.cookiesDialog .cookiesSetting__button--green:hover,
#cboxContent .cookiesSetting__button--green:hover {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.9), rgba(21, 128, 61, 0.9)) !important;
    box-shadow: 0 0 12px rgba(34, 197, 94, 0.5) !important;
}

/* Turn off link styling - ensure same height as other buttons with higher specificity */
.cookiesDialog .cookiesSetting__uncheckLink,
#cboxContent .cookiesSetting__uncheckLink {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.7), rgba(185, 28, 28, 0.7)) !important;
    border: 1px solid rgba(239, 68, 68, 0.8) !important;
    border-radius: 8px !important;
    color: #ffffff !important;
    text-decoration: none !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
    box-shadow: 0 0 8px rgba(239, 68, 68, 0.3) !important;
    transition: all 0.2s ease !important;
    padding: 14px 24px !important;
    min-height: 48px !important;
    height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

.cookiesDialog .cookiesSetting__uncheckLink:hover,
#cboxContent .cookiesSetting__uncheckLink:hover {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.9), rgba(185, 28, 28, 0.9)) !important;
    box-shadow: 0 0 12px rgba(239, 68, 68, 0.5) !important;
    transform: translateY(-1px) !important;
}

.cookiesSetting__uncheckLink:hover {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.9), rgba(185, 28, 28, 0.9)) !important;
    box-shadow: 0 0 12px rgba(239, 68, 68, 0.5) !important;
    transform: translateY(-1px) !important;
}

/* Close button */
#cboxClose {
    background: rgba(239, 68, 68, 0.8) !important;
    border: 1px solid rgba(239, 68, 68, 0.8) !important;
    border-radius: 50% !important;
    color: #ffffff !important;
    box-shadow: 0 0 8px rgba(239, 68, 68, 0.3) !important;
    transition: all 0.2s ease !important;
}

#cboxClose:hover {
    background: rgba(239, 68, 68, 1) !important;
    box-shadow: 0 0 12px rgba(239, 68, 68, 0.5) !important;
    transform: scale(1.05) !important;
}

/* Toggle switch container - remove white border/background and add hover animation */
.cookiesSetting__item__status {
    border: none !important;
    background: none !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
}

.cookiesSetting__item__status:hover {
    transform: scale(1.05) translateY(-1px) !important;
}

/* Ensure toggle switches remain functional with slight styling */
.cookiesSetting__item__state {
    border-radius: 12px !important;
    background: rgba(107, 114, 128, 0.6) !important;
    border: 1px solid rgba(147, 51, 234, 0.3) !important;
    transition: all 0.2s ease !important;
}

.cookiesSetting__item__checkbox:checked + .cookiesSetting__item__state {
    background: linear-gradient(135deg, rgba(147, 51, 234, 0.8), rgba(88, 28, 135, 0.8)) !important;
    border-color: rgba(147, 51, 234, 0.8) !important;
    box-shadow: 0 0 6px rgba(147, 51, 234, 0.4) !important;
}

/* Overall hover effect for dialog */
.cookiesSetting__form:hover {
    box-shadow: 
        0 0 25px rgba(147, 51, 234, 0.4),
        0 12px 40px rgba(0, 0, 0, 0.3) !important;
}